<?php include_once VIEWS.'inc_header.php'; ?>

<?php echo static_file('img/glyphicons-halflings.png') ?>

<?php echo static_file('testfile/test.js'); ?> 
<?php echo static_file('testfile/test.css'); ?> 

<div class="fixclear">
    <button id='get-list' data-id='1'>获取列表</button>
</div>

<!-- 容器 -->
<ul id='js-list-show'></ul>
<!-- 模板 -->
<script id="tpl-list-show" type="text/html">
<%for(i = 0; i < list.length; i ++) {%>
    <li>  <%=list[i].author%> - <%=list[i].title%> </li>
<%}%>
</script>

<script type="text/javascript" charset="utf-8">

$(function(){

    $('#get-list').on('click',function(event){
        event.preventDefault();

        var id = $(this).attr('data-id');

        (function(id){

            $.ajax({
                url: "<?php echo site_url('x_ajax') ?>",
                type: 'get',
                dataType: 'json',
                data: {id:id},
            })
            .done(function(data) {
                console.log("success");
                if (data.status = 1) {
                    // 这里使用了 artTemplate
                    var html = template.render('tpl-list-show', data);
                    $('#js-list-show').append(html);
                };
            })
            .fail(function() {
                console.log("error");
            })
            .always(function() {
                console.log("complete");
            });

        })(id);

    });

});

</script>



<?php include_once VIEWS.'inc_footer.php'; ?>
